JavaScriptおみくじ 〜その1〜
JavaScriptを使用すると、簡単な「おみくじ」を作成することができます。今回は、ページを表示させるごとに違った結果が表示される「おみくじ」の作成方法を紹介してみましょう。

→ まずはサンプルを確認してください
 
JavaScriptでおみくじを作成する


→ 画像ファイル名を配列として定義する
 
今回、紹介する「おみくじ」では、おみくじの結果を画像ファイルで表示します。
まずは、『大吉』『中吉』『小吉』など、おみくじの結果を必要なだけ画像ファイルで作成してください。 続いて、作成した画像ファイルのファイル名を「images」という名のJavaScript配列に定義します。
<SCRIPT language="JavaScript">
<!--
images = new Array("kuji01.jpg","kuji02.jpg","kuji03.jpg");
// -->
</SCRIPT>
  • 上記のJavaScriptは、BODYタグ内で「おみくじ」画像を表示させる場所に記述してください。


→ 乱数を発生させる
 
次は、「おみくじ」のメインともいえる乱数「a」の発生です。
これにはJavaScriptのメソッド「Math.random( )」を利用します。
「Math.random( )」は0〜1の乱数を発生させるメソッドなので、これを3倍にして0〜3の乱数を発生します。
さらに「Math.floor( )」で整数化することにより、乱数「a」の値を0、1、2のいずれかの整数とします。
<SCRIPT language="JavaScript">
<!--
images = new Array("kuji01.jpg","kuji02.jpg","kuji03.jpg");
a = Math.floor(Math.random( )*3);
// -->
</SCRIPT>
  • 上記の例では、3種類の乱数(0、1、2)を発生させています。発生させる乱数の数は、「Math.random( )」に乗ずる数で調整してください。


→ おみくじ画像を表示させる
 
あとは、乱数「a」と配列「images」を使って画像を表示してやるだけで、「おみくじ」は完成です。
「document.write」を使用して、IMGタグとsrc属性を出力してください。
今回の例では、画像のファイル名は「images[a]」となります。
<SCRIPT language="JavaScript">
<!--
images = new Array("kuji01.jpg","kuji02.jpg","kuji03.jpg");
a = Math.floor(Math.random( )*3);
document.write("<IMG src='" , images[a] , ">");
// -->
</SCRIPT>

e[NECir Yahoo yV LINEf[^[z500~`I
z[y[W NWbgJ[h COiq@COsI COze